import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import QtCharts

Rectangle {
    Layout.fillWidth: true
    Layout.fillHeight: true

    ColumnLayout {
        anchors.fill: parent

        ChartView {
            title: "BarSet 信号与方法示例"
            titleFont.bold: true
            titleFont.pointSize: 14

            Layout.fillWidth: true
            Layout.fillHeight: true
            antialiasing: true

            BarCategoryAxis {
                id: axisX
                categories: ["1", "2", "3", "4", "5"]
            }

            ValueAxis {
                id: axisY
                min: 0
                max: 20
            }

            BarSeries {
                id: barSeries
                axisX: axisX
                axisY: axisY
                barWidth: 0.6

                // 添加初始数据集
                BarSet {
                    id: barSet1
                    label: "数据集1"
                    values: [5, 10, 15, 12, 8]
                    color: "#FF9612"

                    // 连接BarSet信号
                    onClicked: function(index) {
                        logArea.append("barSet1 onClicked 信号触发: index=" + index + ", value=" + at(index))
                    }
                }

                BarSet {
                    id: barSet2
                    label: "数据集2"
                    values: [8, 12, 10, 14, 6]
                    color: "#1296FF"

                    // 连接BarSet信号
                    onClicked: function(index) {
                        logArea.append("barSet2 clicked 信号触发: index=" + index + ", value=" + at(index))
                    }
                }
            }
        }

        // BarSet选择
        Row {
            spacing: 10
            Label { text: "选择BarSet:"; anchors.verticalCenter: parent.verticalCenter }
            ComboBox {
                id: barSetSelector
                model: ["barSet1", "barSet2"]
                width: 100
            }
        }

        // 方法调用按钮
        Row {
            spacing: 5

            Button {
                text: "append(值)"
                onClicked: {
                    const selectedBarSet = barSetSelector.currentIndex === 0 ? barSet1 : barSet2;
                    if ( selectedBarSet.count >= axisX.count) {
                        logArea.append("超过分类数不会显示");
                        return;
                    }

                    // 超过分类数不会显示，但会追加到数据集中
                    const value = 10;
                    selectedBarSet.append(value);
                    logArea.append("调用 " + selectedBarSet.label + ".append(" + value + ")");
                }
            }

            Button {
                text: "remove(索引, 数值)"
                onClicked: {
                    const selectedBarSet = barSetSelector.currentIndex === 0 ? barSet1 : barSet2;
                    const index = selectedBarSet.count - 1;
                    const count = 1;
                    if (index < 0) {
                        logArea.append("移除失败");
                        return;
                    }
                    const ret = selectedBarSet.remove(index, count);
                    logArea.append("调用 " + selectedBarSet.label + ".remove(" + index + "," + count + ")");
                }
            }

            Button {
                text: "replace(索引, 数值)"
                onClicked: {
                    const selectedBarSet = barSetSelector.currentIndex === 0 ? barSet1 : barSet2;
                    const index = selectedBarSet.count - 1;
                    const value = 20;
                    if (index < 0) {
                        logArea.append("替换失败");
                        return;
                    }
                    selectedBarSet.replace(index, value);
                    logArea.append("调用 " + selectedBarSet.label + ".replace(" + index + "," + value + ")");
                }
            }

            Button {
                text: "打印所有值"
                onClicked: {
                    for(var i = 0; i < barSeries.count; i++) {
                        let values = "";
                        const eachBarSet = barSeries.at(i);
                        for(var j = 0; j < eachBarSet.count; j++) {
                            values += eachBarSet.at(j) + (j < eachBarSet.count - 1 ? "," : "");
                        }
                        logArea.append(eachBarSet.label + "所有值：[" + values + "]");
                    }
                }
            }

            Button {
                text: "清空日志"
                onClicked: {
                    logArea.text = "日志已清空\n"
                }
            }
        }

        // 用于显示信号触发信息的区域
        ScrollView {
            id: scrollView
            Layout.minimumHeight: 100
            Layout.maximumHeight: 100
            Layout.fillWidth: true
            Layout.margins: 10

            ScrollBar.vertical: ScrollBar {
                policy: ScrollBar.AlwaysOn
                anchors.top: scrollView.top
                anchors.bottom: scrollView.bottom
                anchors.right: scrollView.right

                // 保持滚动到底端
                position: {
                    if (scrollView.height > 0 && scrollView.contentHeight > scrollView.height) {
                        return (scrollView.contentHeight - scrollView.height) / scrollView.contentHeight;
                    }
                    return 0;
                }
            }

            TextArea {
                id: logArea
                readOnly: true
                text: "BarSet 信号与方法调用日志...\n"
            }
        }
    }
}
